{include file="common/header" /}
<div class="admin-mains">
    <div class="admin-main">
        <div class="top-tabs">
            <div class="list">
                <a class="active" href="{:url(CONTROLLER_NAME.'/list')}">示例组管理</a>
                <!-- <a href="{:url('users/add')}">添加用户</a> -->
            </div>
            <i class="borderline"></i>
        </div>
        <div class="admin-list-data layui-form pad40">

            <div class="searchline" style="margin-bottom: 20px;">
                <form action="" >
                    <div class="search-block">
                        <input type="text" name="title" value="{:input('param.title')}" placeholder="请输入标题">
                        <button class="submit" type="submit"></button>
                    </div>
                </form>
            </div>

            <a class="btn bule-btn" href="{:url(CONTROLLER_NAME.'/add')}">添加</a>
            <div class="lists mt30">
                <table width="100%" border="0">
                    <tbody>
                        <tr class="noborder">
                            <th class="th1" style="width: 80px;">选择</th>
                            <th style="width: 80px;">ID</th>
                            <th>标题</th>
                            <th>表名</th>
                            <th>添加时间</th>
                            <th class="th4">操作</th>
                        </tr>
                        {volist name="res" id="vo"}
                        <tr>
                            
                            <td class="ac">
                                <div class="check"><input class="materials" type="checkbox" name="checkid[]" id="checkid[]" value="{$vo['id']}" lay-skin="primary" lay-filter="materials"></div>
                            </td>
                            <td class="ac">{$vo.id}</td>
                            <td class="ac">{$vo.title}</td>
                            <td class="ac">{$vo.example_ids_name}</td>
                            <td class="ac">{$vo.add_time}</td>
                            <td>
                                <div class="operation">
                                    <a class="item" href="{:url(CONTROLLER_NAME.'/edit',['id'=>$vo.id])}"><i class="edit"></i><span>编辑</span></a>
                                    <a class="item delete" data-id="{$vo.id}" href="javascript:;"><i class="dele"></i><span>删除</span></a>
                                </div>
                            </td>
                        </tr>
                        {/volist}
                    </tbody>
                </table>
                <div class="botline clearfix">
                    <div class="left">
                        <!-- <a class="btn bule-btn" href="#">批量审核</a>
                        <a class="btn bule-btn" href="#">批量推荐</a> -->
                        <div class="selectall"><input type="checkbox" id="checkAll" name="checkid" lay-skin="primary" lay-filter="checkAll" title="全选" ></div>
                        <a class="btn pink-btn all_del" href="javascript:;">批量删除</a>
                        
                    </div>


                    {if $total > 0 && $total <= 10 /}
                    <div class="right pages">
                        <div class="number">
                            <a class="prev" href="javascript:;"><span></span></a>
                            <a class="active" href="javascript:;">1</a>
                            <a class="next" href="javascript:;"><span></span></a>
                        </div>
                    </div>
                    {else/}
                        {$page|raw}
                    {/if}
                    
                </div>
            </div>
            
        </div>
    </div>
</div>




<div id="showPicarr" style="display: none">
    
    <div class="layui-carousel" id="test1" lay-filter="test1">
        <div id="divimg" carousel-item>
            <!-- <div class="imgdev"><a href="/upload/2023/10-24/79098de8f0eb599b950d063eda3f1632.png" target="_blank" ><img src="/upload/2023/10-24/79098de8f0eb599b950d063eda3f1632.png"></a></div> -->
        </div>
    </div>
</div>


<script>
    var checkboxes = $(".materials");
    var checkedId = [];
    layui.use(['form', 'table','carousel'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table,
            carousel = layui.carousel;
        //展示组图弹窗
        window.openPicarr=function(obj){
            let picarr = $(obj).attr("data-picarr");
            let arr=picarr.split(",");
            let html = '';
            for(let i=0;i<arr.length;i++){
                html += '<div class="imgdev"><a href="'+arr[i]+'" target="_blank" ><img src="'+arr[i]+'"></a></div>';
            }

            $("#divimg").html("");
            $("#divimg").html(html);

            //建造实例
            carousel.render({
                elem: '#test1'
                ,width: '100%' //设置容器宽度
                ,arrow: 'always' //始终显示箭头
                ,interval:'5000'
                //,anim: 'updown' //切换动画方式
            });
                        //触发轮播切换事件
            carousel.on('change(test1)', function (obj) {
                i = obj.index
            });

            layer.open({
              type: 1, 
              title:'组图显示',
              area: ['500px', '320px'],
              content: $("#showPicarr") //这里content是一个普通的String
            });
        };

        //复选框 多选
        form.on('checkbox(checkAll)', function(data){
            var elem = data.elem;
            checkboxes.prop("checked", elem.checked);
            getAllId()
        });
        // 列表里的小选择框 materials 与表单的对应
        form.on('checkbox(materials)', function(data){
            var elem = data.elem;
            if (checkboxes.not('input:checked').length) {
                $('#checkAll').prop("checked", false);
            } else {
                $('#checkAll').prop("checked", true);
            }
            getAllId()
        });

        window.getAllId=function(){
            checkedId = [];
            checkboxes.each(function(k, v){
                if ($(v).is(':checked')) {
                    checkedId.push($(v).val())
                }
            })
            form.render()
        }

        //改变排序
        window.checkSort=function(obj){
            let table = $(obj).attr("data-table");
            let id_name = $(obj).attr("data-id_name");
            let id = $(obj).attr("data-id");
            let val = $(obj).val();
            let field = $(obj).attr("data-field");

            $.ajax({
                url:"{:url(CONTROLLER_NAME.'/changeOrderid')}",
                data: {'table':table,'id_name':id_name,'id':id,'field':field,'val':val},
                type:'post',
                dataType:'json',
                success:function(res){
                    // console.log(res);
                    // return false;
                    if(res.errcode == 1){
                        layer.msg(res.message,{icon: 1,time: 1000},function(){
                            location.reload();
                        })
                    }else {
                        layer.msg(res.message,{icon: 2,time: 2000})
                    }
                    // parent.layer.close(index);
                },
                error : function(XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('网络失败，请刷新页面后重试!',{icon: 2,time: 2000})
                }
            });
        };

        //删除
        $(".delete").click(function(){
            //let dataurl = $(this).attr('data-url');
            let id= $(this).attr("data-id");
            // 删除按钮
            layer.confirm('确认删除？', {
                title:'温馨提示',closeBtn:0,icon:3,
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    type: 'post',
                    data:{'table':"{:CONTROLLER_NAME}",ids:id},
                    url: "{:url(CONTROLLER_NAME.'/delete')}?id="+id,
                    dataType: 'json',
                    success: function (res) {
                        // console.log(res)
                        // return false
                        layer.closeAll();
                        if (res.errcode == 1) {
                            layer.msg(res.message,{icon: 1,time: 1000},function(){
                                //$(obj).parent().parent().parent().remove();
                                location.reload();
                            })
                        } else {
                            layer.msg(res.message,{icon: 2,time: 2000})
                            //layer.alert(data, {icon: 2});  //alert('删除失败');
                        }
                    }
                })
            }, function () {
                layer.closeAll();
            });

        });


        //群删
        $(".all_del").click(function(){
            if(checkedId.length <= 0){
                layer.msg("请选择要删除的信息",{icon: 2,time: 2000})
                return false;
            }
            let ids = checkedId.join(", ");

            console.log(ids)

            layer.confirm('确认删除吗？', {
                title:'温馨提示',closeBtn:0,icon:3,
                btn: ['确定', '取消'] //按钮
            }, function () {
                $.ajax({
                    type: 'post',
                    url: "{:url(CONTROLLER_NAME.'/delete')}",
                    data:{'table':"{:CONTROLLER_NAME}",ids:ids},
                    dataType: 'json',
                    success: function (res) {
                        layer.closeAll();
                        if (res.errcode == 1) {
                            layer.msg(res.message,{icon: 1,time: 1000},function(){
                                location.reload();
                            })
                        } else {
                            layer.msg(res.message,{icon: 2,time: 2000})
                        }
                    }
                })
            }, function () {
                layer.closeAll();
            });
        });


        //是否开启
        form.on('switch(switchIsOpen)', function(data){
            var checked = data.elem.checked;
            //var role_id = data.elem.value;
            let table = $(data.elem).attr("data-table");
            let id_name = $(data.elem).attr("data-id_name");
            let id = $(data.elem).attr("data-id");
            let field = $(data.elem).attr("data-field");
            console.log(table)
            // var id = data.elem.attributes['switch_id'].nodeValue;
            // var pri_id = data.elem.attributes['switch_pri_id'].nodeValue;
            // var tempId = data.elem.attributes['switch_tempId'].nodeValue;

            $.ajax({
                url:"{:url(CONTROLLER_NAME.'/changeStatus')}",
                data: {'table':table,'checked':checked,'id_name':id_name,'id':id,'field':field},
                type:'post',
                dataType:'json',
                success:function(res){
                    // console.log(res);
                    // return false;
                    if(res.errcode == 1){
                        layer.msg(res.message,{icon: 1,time: 1000},function(){
                            location.reload();
                        })
                    }else {
                        layer.msg(res.message,{icon: 2,time: 2000})
                    }
                    // parent.layer.close(index);
                },
                error : function(XMLHttpRequest, textStatus, errorThrown) {
                    layer.msg('网络失败，请刷新页面后重试!',{icon: 2,time: 2000})
                }
            });
           
            
        });

        // 监听搜索操作
        form.on('submit(data-search-btn)', function (data) {
            //var result = JSON.stringify(data.field);
            // layer.alert(result, {
            //     title: '最终的搜索信息'
            // });
            table.reload('currentTableId',{
                where: data.field
                , page: {
                    curr: 1 //重新从第 1 页开始
                }
            })
            return false;
        });


    });
</script>

</body>
</html>